<!--订阅消息通知详情-->
<template>
  <div class="notice-particulars-box">
    <div class="noticeContent">
      <div class="title">{{dataList.title}}</div>
      <dl>
        <dt>时间：</dt>
        <dd>{{dataList.outBeginTime}}{{dataList.outEndTime?'至'+dataList.outEndTime:''}}</dd>
      </dl>
      <dl>
        <dt>原因：</dt>
        <dd>{{dataList.outReason}}</dd>
      </dl>
      <dl>
        <dt>区域：</dt>
        <dd>{{dataList.outArea}}</dd>
      </dl>
    </div>
    <FooterTel></FooterTel>
  </div>
</template>

<script>
import FooterTel from '../components/footerTel.vue'
export default {
  name: 'Detail',
  components: {
    FooterTel
  },
  data () {
    return {
      title: null,
      id: null,
      dataList: [],
      dataTotal: 0,
    };
  },
  watch: {
  },
  async onShow () {

  },
  async onLoad (e) {
    var vm = this;
    vm.id = e.id
    console.log(e.id);
  },
  created () {
  },
  methods: {
    getList () {
      var vm = this
      vm.tui.request('/api/gasout/list', 'POST', { id: vm.id }, false, false, false).then((res) => {
        if (res.code == 200 && res.data.length) {
          vm.dataList = res.data[0]
          vm.dataTotal = res.total
          vm.isData = res.total >= 1 ? false : true
        }
      }).catch((e) => { })
    },
  },
  mounted () {
    var vm = this;
    vm.getList()
  },
};
</script>

<style lang="scss" scoped>
@import "../../static/css/module.scss";
.notice-particulars-box {
  padding: 20px;
  .noticeContent {
    border-radius: 10px;
    background: #fff;
    padding: 14px;
    margin-bottom: 14px;
    .title {
      font-size: 16px;
      color: #222;
      border-bottom: 1px solid #f2f2f2;
      line-height: 22px;
      padding-bottom: 12px;
      margin-bottom: 12px;
    }
    dl {
      display: flex;
      padding: 8px 0;
      font-size: 15px;
      line-height: 22px;
      dt {
        width: 60px;
        color: #666;
      }
      dd {
        width: calc(100% - 60px);
        color: #222;
      }
    }
  }
  ::v-deep .contactBox {
    padding: 0;
  }
}
</style>
